<template>
  <div class="html1_4">
    <h1>1.4 框架标签</h1>
    <div class="html1_4_1">
      <h2>1.4.1 帧标记&lt;frame></h2>
      <p>
        <pre>
帧技术又叫框架技术。迄今为止，我们所提到的所有网页都能链接到其他网页，但是每次只能显示一个网页，为了能够在同一浏览器中显示多个页面，则必须使用帧技术。为了说明一个HTML文档中使用了帧技术，必须在文档类型中给予相应的说明，该文档类型说明如下：&lt;!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “http://www.w3.org/TR/html4/loose.dtd”>，帧式网页起始于开始标记&lt;frameset>。
帧集有两个重要属性，即cols属性（列属性）和rows属性（行属性），其中cols属性给出了帧集页面的纵向布局，而rows属性则给出了帧集页面的横向布局。这两个属性会指定每个帧的宽度，或像素值，或所占屏幕的百分比。例如&lt;frameset cols=”110, * ”>告诉浏览器该网页有两个帧，第一个从屏幕左侧扩展了110个像素点，第二个帧填充了屏幕的剩余部分。
帧集标记只说明在一个浏览器中可以有多少个页面，但是每个页面该如何表达，是标记&lt;frameset>无法实现的，因此在&lt;frameset>...&lt;/frameset>内必须将每个帧的内容表达出来。HTML是通过在&lt;frameset>...&lt;/frameset>内镶嵌&lt;frame>来实现的。
【语法】
帧标记&lt;frame>常用格式为：
&lt;frame name=”main” src=”main.html”>
其中name属性是标识帧，而src则表示在帧中建立一个超链接。帧标记往往与下面的格式一起使用：
&lt;a href=”link.html”, target=”main”>
其作用是在name属性为”main”的帧中加载页面link.html
重要事项：您不能与 &lt;frameset>&lt;/frameset> 标签一起使用 &lt;body>&lt;/body> 标签。不过，如果您需要为不支持框架的浏览器添加一个 &lt;noframes> 标签，请务必将此标签放置在 &lt;body>&lt;/body> 标签中！
【例2.27】frame标记的应用。
主文件index.html：
&lt;html lang="en">
&lt;head>
    &lt;meta charset="UTF-8">
    &lt;meta http-equiv="X-UA-Compatible" content="IE=edge">
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0">
    &lt;title>使用VsCode编辑的HTML文件&lt;/title>
&lt;/head>
&lt;frameset cols="15%,85%">
    &lt;frame src="index2.html" scrolling="no" name="win001">
    &lt;frame src="index3.html" name="win002">
&lt;/frameset>
&lt;noframes>
    &lt;body>Please use a Web browser such as IE3.0 orNetscape Navigator to view this page in frames!&lt;/body>
&lt;/noframes>
&lt;/html>

文件index2.html:
&lt;html>
&lt;head>&lt;/head>
&lt;body>
&lt;a href="1.html" target="win002">实例1&lt;/a>&lt;br>&lt;br>
&lt;a href="2.html" target="win002">实例2&lt;/a>
&lt;/body>
&lt;/html>
该HTML文档的显示效果如图2-12所示。
        </pre>
      </p>
       <video src="../assets/h5实例视频/frameset标签.mp4" width="600px" controls></video>
          <img src="../assets/images/2.25.png" alt="">
        <p>图2-12</p>
    </div>
    <div class="html1_4_2">
        <h2>1.4.2  IFRAME标记</h2>
        <p>
            <pre>
                Iframe标记，又叫浮动帧标记，可用它将一个HTML文档嵌入在另一个HTML中显示。它不同于Frame标记，frame最大的特征是所应用的HTML文件不是与另外的HTML文件相互独立显示，而是可以直接嵌入在该HTML文件中，与这个HTML文件内容相互融合，成为一个整体，另外，还可以多次在一个页面内显示同一内容，而不必重复写内容，一个形象的比喻即“画中画”电视。
【语法】
&lt;Iframe src=”URL” width=”x” height=”x” scrolling=”[OPTION]” frameborder=”x”>&lt;/iframe>
src：文件的路径，既可是HTML文件，也可以是文本、ASP文件等。
width、height：“画中画”区域的宽与高。
scrolling：当SRC指定的HTML文件在指定的区域显示不完是的滚动选项，如果设置为NO，则不出现滚动条；如为Auto，则自动出现滚动条；如为Yes，则显示滚动条。
FrameBorder：区域边框的宽度，为了让“画中画”与邻近的内容相融合，常设置为0
在脚本语言与对象层次中，包含IFrame的窗口称之为父窗体，而浮动帧则称为子窗体，弄清这两者的关系很重要，必须清楚对象层次，才能通过程序来访问并控制窗体。
IFrame虽然内嵌在另一个HTML文件中，但它保持相对的独立，是一个“独立王国”，在HTML中的特性同样适用于浮动帧中。通过IFrame标记，可将那些不变的内容以IFrame来表示，不必重复写相同的内容。它使页面的修改更为方便，不必因为版式的调整而修改每个页面，只需修改一个父窗体的版式即可了。例如：
&lt;IFrame src=”frame.htm width=”400” height=”200” scrolling=”auto” frameborder=”1”>&lt;/frame>
            </pre>
        </p>
       <video src="../assets/h5实例视频/Iframe标签.mp4" width="600px" controls></video>
       <p>有一点要注意，Netscape浏览器不支持IFrame标记。</p>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style>
</style>